<template>
  <div>
    <a-modal
      title="物流信息"
      :confirm-loading="sendModalLoading"
      :mask-closable="false"
      :destroy-on-close="true"
      :visible="visible"
      @ok="send"
      @cancel="$emit('update:visible', false)"
    >
      <a-tabs :default-active-key="1" v-model="activeKey">
        <a-tab-pane tab="快递" key="1">
          <a-form-item
            >
            <div class="dropbox">
              <a-upload-dragger
                accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel"
                :action="upload_url"
                :headers="upload_headers"
                :listType="upload_list_style"
                :multiple="false"
                :name="upload_file_name"
                :remove="onUploadRemove"
                :fileList="fileList"
                @change="onUploadChange"
                @reject="onUploadReject"
              >
                <p class="ant-upload-drag-icon">
                  <a-icon type="inbox" />
                </p>
                <p class="ant-upload-text">
                  点击上传文件
                </p>
                <p class="ant-upload-hint">
                  仅支持单次上传。
                </p>
              </a-upload-dragger>
            </div>
          </a-form-item>
          <a-form-item><a-button @click='getXlsx'>下载模版</a-button> </a-form-item>
        </a-tab-pane>
      </a-tabs>
    </a-modal>
  </div>
</template>

<script>
import {
  supplierOrderSend,
  supplierOrderXlsxSend
} from '@/api/purchase/purchase'
import api from '@/api/storage'
import storage from 'store'
import { ACCESS_TOKEN } from '@/store/mutation-types'
import axios from 'axios'
import { sendGoods } from '@/api/purchase/supplier'
export default {
  components: {},
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    expressList: {
      type: Array,
      default: () => [],
    },
    orderId: {
      type: String,
      default: '',
    },
    xlsx: {
      type: String,
      default: '',
    },
    orderInfo: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      activeKey: '1',
      express: {
        words: '',
      },
      sendModalLoading: false,
      showNotive: false,
      upload_file_mime: '',
      fileList: [],
      option: {},
      update_xlsx: ''
    }
  },
  computed: {
    upload_file_name: function () {
      return 'xlsx'
    },
    upload_url: function () {
      const baseUrl = process.env.VUE_APP_API_BASE_URL
      return baseUrl + api.upload_xlsx
    },
    upload_headers: function () {
      const token = storage.get(ACCESS_TOKEN)
      return { Authorization: 'Bearer ' + token }
    },
    upload_list_style: function () {
      return this.type === 'image' ? 'picture' : 'text'
    },
    // 上传文件删除回调
    onUploadRemove: function () {
      //
    },
  },
  watch: {
    visible(val) {
      if (val && this.orderInfo?.id) {
        let haveExpress = this.orderInfo.goods_list.some((d) => {
          return d.delivery_type == '0'
        })
        let haveShop = this.orderInfo.goods_list.some((d) => {
          return d.delivery_type == '1'
        })
        // 如果有物流和门店自提订单时，发货时需要提醒该订单包含门店自提
        if (haveExpress && haveShop) {
          this.showNotive = true
        }
      }
    },
  },
  created() {},
  mounted() {},
  updated() {},
  methods: {
    getXlsx(){
      window.location.href = this.xlsx
    },
    // 上传文件改变事件
    onUploadChange: function (info) {
      console.log(info);
      // axios.post(this.upload_url,
      //   qs.stringify({
      //   data
      // }),)
      //   .then(res=>{
      //     console.log('res=>',res);
     //   })
     //  let config = {
     //    headers: {'Content-Type': 'multipart/form-data'}
     //  }
     //  let file = info.target.files[0]
     //  let param = new FormData()       // 创建form对象
     //  param.append('xlsx', file)       // 通过append向form对象添加数据
     //  axios.post(this.upload_url,param, config).then((res)=>{
     //    console.log(res);
     //    if(res.succeed){
     //      this.$message.success("添加成功")  //需要引入elemrnt
     //    }else{
     //      this.$message.warning("添加失败")
     //    }
     //  }).catch((err)=>{
     //    this.$message.warning("图片上传失败，请重新上传!")
     //  })      // console.log('info----------,',info);
      // //const mime = this.type === 'image' ? this.option.image_mime : this.option.video_mime
      const list = []
      let url = '';
      for (let i = 0; i < info.fileList.length; i++) {
        if (info.fileList[i].response) {
          console.log(info.fileList[i].response);
          if (info.fileList[i].response.code === 0) {
            url = info.fileList[i].response.data[0].url;
          }

        }
      // //   if (mime.indexOf(info.fileList[i].type) === -1) {
      // //     this.$message.warning('文件 ' + info.fileList[i].name + ' 格式不支持上传')
      // //   } else {
           list.push(info.fileList[i])
      // //   }
      }
      this.update_xlsx = url;
      console.log(url);
      this.fileList = list
    },
    // 拖动上传文件不符合accept类型
    onUploadReject: function (fileList) {
      const mime = this.type === 'image' ? this.option.image_mime : this.option.video_mime
      for (let i = 0; i < fileList.length; i++) {
        if (mime.indexOf(fileList[i].type) === -1) {
          this.$message.warning('文件 ' + fileList[i].name + ' 格式不支持上传')
        }
      }
    },

    async send() {
      const hide = this.$message.loading('发货中...', 0)
      var params = {
        xlsx: this.update_xlsx
      }
      let res;
      if (parseInt(this.orderInfo.send_type) === 1) {
        res = await supplierOrderXlsxSend(params);
      } else {
        res = await sendGoods(params)
      }
      hide()
      if (res.code === 0) {
        this.$message.success('发货成功！')
        this.$emit('update:visible', false)
        this.$emit('onAfterClose')
      } else {
        this.$error({
          content: res.msg,
        })
      }
    },
  },
}
</script>

<style scoped>
</style>